<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        #d1{
            margin-bottom: 30px;
            color: white;
            padding-left:25px ;
        }
        .box{
        margin-left:30px;
        background-color: tomato;
        width: 100px;
        height: 100px;
    }
    </style>
   

</head>
<body>
    <div class="box">
    <div  id="d1">李帅</div>
    <input type="button"  value="抽奖"  id="luckyBtn"  />

   </div>
    <script>
       var names = ["李帅", "种庆", "陈宇", "代茹楠", "杨瑞成", "杨淮庆", "刘警东",
        "刘慧慧", "林伟伟", "孙成威", "吕刘义", "应青苗", "郑婷婷", "李子迪", "张炎华",
        "杨文豪", "王国庆", "王强强", "刘珍珍", "陈龙"];
        var i=0;
        function  f(){
            if(i==names.length-1){
                i=-1;
            }
            d1.innerHTML=names[++i];
              }
      luckyBtn.onclick=function(){
          if(this.value!="暂停"){
           timer= setInterval(f,1000);
              this.value="暂停";
            
          }else{
              clearInterval(timer);
              this.value="抽奖 ";
     }
   }
     
  </script>
    
</body>
</html>